<template>
	<view>
		<view class="videobox" :style="[{'background-color':videoboxBackgroundColor}]">
			<view class="videolistS-v" :style="[{'width':videolistWidth}]">
				<view class="videolistS-v-item"
				v-for="(item,index) in  videolist" :key="index"
				:data-item="item"
				>
					<view class="Imagebox">
						<!-- 封面 -->
						<image class="Image" 
						:src="item.vod_pic"
						mode="aspectFill"
						></image>
						<!-- 顶部VIP角标||收藏等 -->
						<view class="top" v-if="item.vod_class">
							<text class="top-text">{{item.vod_class}}</text>
						</view>
						<!-- 底部评分||集数等 -->
						<view class="bottom">
							<text class="bottom-text">{{item.vod_remarks}}</text>
						</view>
					</view>
					<view class="videotitle">
						<!-- 标题 -->
						<view class="title">
							<text class="title-text">{{item.vod_name}}</text>
						</view>
						<!-- 摘要 || 主演 -->
						<view class="desc">
							<text class="desc-text">{{item.vod_actor}}</text>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		props:{
			// 数据列表
			videolist:{
				type:Array,
				default:[]
			},
			// 外盒子背景色
			videoboxBackgroundColor:{
				type:String,
				default:'rgba(255, 255, 255, .0)'
			},
			// 内盒子宽度
			videolistWidth:{
				type:String,
				default:'690rpx'
			}
		},
		name:"FatFatMeng-videolistS-v",
		data() {
			return {
				
			};
		}
	}
</script>

<style lang="scss" scoped>
	@import './videolistS-v.scss';
</style>
